<template>
	<div class="container">
		<div class="my_nav"><h3>我的信息</h3></div>
		<div class="row" v-for="(item,index) in infolist">
			<div class="col-6">
				<h4>名字: {{item.name}}</h4>
				<h4>个性签名: {{item.description}}</h4>
			</div>
			<div class="col-6">
				<h4>电话: {{item.phone}}</h4>
				<h4>电子邮件: {{item.email}}</h4>
			</div>
		</div>		
	</div>
</template>

<script>
	export default{
		data(){
			return{
				infolist:[{
					name:"",
					phone:"",
					email:"",
					description:""
				}]				
			}
		},
		created: function(){
			this.infolist[0].name = sessionStorage.getItem("nickname");
			this.infolist[0].phone = sessionStorage.getItem("tel");
			this.infolist[0].email = sessionStorage.getItem("email");
			this.infolist[0].description= sessionStorage.getItem("description");

		}
		
	}
</script>

<style lang="less" scoped="scoped">
	.container{
		margin-top: 20px;	
		.my_nav{
			border: #002752 solid 1px;
			border-radius: 10px 10px 0 0;
			background-color: #FFFFFF;
			h3{
				height: 80px;
				line-height: 80px;
				padding-left: 40px;
			}
			
		}
		.row {
			background-color: #FFFFFF;
			border: #002752 solid 1px;
			border-radius:  0 0 10px 10px;
			margin-left: 0;
			margin-right: 0;
			h4{
				
				text-align: center;
				padding: 20px 0 40px 0;
				i{
					padding: 0 10px 0 10px;
					
					&:hover{
						color: #5ed0c7;
					}
				}
			}
		}
		
	}
</style>
